import React from 'react';
import { Row, Col, Typography } from 'antd';
import { formatJSON, formatXML } from '@/utils/utils';
import CodeEditor from '@/components/CodeEditor';

const { Text } = Typography;

function ValidationTaskContent({ content }) {
  const { input = '', result } = content;
  const isXML = input.trim().startsWith('<');

  const message = isXML ? formatXML(input) : formatJSON(input);

  return (
    <Row gutter={16}>
      <Col span={12}>
        <div className="margin-bottom">
          <Text>校验报文：</Text>
        </div>
        <CodeEditor mode={isXML ? 'xml' : 'json'} data={input} readOnly height={550} />
      </Col>
      <Col span={12}>
        <div className="margin-bottom">
          <Text>校验结果：</Text>
        </div>
        <CodeEditor data={result} readOnly height={550} />
      </Col>
    </Row>
  );
}

export default ValidationTaskContent;
